<!-- Simple listing -->
<button data-target="#simple-listing-dialog" data-toggle="modal" class="btn pmd-ripple-effect btn-primary pmd-z-depth" type="button">Simple Listing</button>

<!-- Dialog Behavior -->
<div tabindex="-1" class="modal fade" id="simple-listing-dialog" style="display: none;" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bordered">
                <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
                <h2 class="pmd-card-title-text">Listing</h2>
            </div>
            <div class="modal-body">
                <ul class="list-group pmd-list">
                  <li class="list-group-item">Cras justo odio</li>
                  <li class="list-group-item">Dapibus ac facilisis inDapibus ac facilisis in Dapibus ac facilisis in</li>
                  <li class="list-group-item">Morbi leo risus</li>
                  <li class="list-group-item">Porta ac consectetur ac</li>
                  <li class="list-group-item">Vestibulum at eros</li>
                </ul>
            </div>
        </div>
    </div>
</div>
<!-- Dialog Behavior -->

<!-- List Selection -->
<button data-target="#list-dialog" data-toggle="modal" class="btn pmd-ripple-effect btn-primary pmd-z-depth" type="button">List Selection</button>

<!-- Dialog Behavior -->
<div tabindex="-1" class="modal fade" id="list-dialog" style="display: none;" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bordered">
                <!--<button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>-->
                <h3 class="pmd-card-title-text">List Selection</h3>
            </div>
            <div class="modal-body">
                <div class="radio">
                    <label class="pmd-radio">
                        <input type="radio" name="inlineRadioOptions" id="Ahmedabad" value="option1">
                        <span for="Ahmedabad">Ahmedabad</span>
                    </label>
                </div>
                <div class="radio">
                    <label class="pmd-radio">
                        <input type="radio" name="inlineRadioOptions" id="Surat" value="option1">
                        <span for="Surat">Surat</span>
                    </label>
                </div>
                <div class="radio">
                    <label class="pmd-radio">
                        <input type="radio" name="inlineRadioOptions" id="Rajkot" value="option1">
                        <span for="Rajkot">Rajkot</span>
                    </label>
                </div>
                <div class="radio">
                    <label class="pmd-radio">
                        <input type="radio" name="inlineRadioOptions" id="Vadodara" value="option1">
                        <span for="Vadodara">Vadodara</span>
                    </label>
                </div>
                <div class="radio">
                    <label class="pmd-radio">
                        <input type="radio" name="inlineRadioOptions" id="Mehsana" value="option1">
                        <span for="Mehsana">Mehsana</span>
                    </label>
                </div>
            </div>
            <div class="pmd-modal-action pmd-modal-bordered text-right">
                <button data-dismiss="modal"  class="btn pmd-ripple-effect btn-primary pmd-btn-flat" type="button">Ok</button>
                <button data-dismiss="modal"  class="btn pmd-ripple-effect btn-default pmd-btn-flat" type="button">Cancel</button>
            </div>
        </div>
    </div>
</div>
<!-- Dialog Behavior -->
